<template>
  <div>
    <div class="adv" @click="advClick(item)" v-for="(item,index) in article" :key="index">
      <div class="con1">
        <img :src="$store.state.baseImgUrl+item.img" alt="" :key="index" style="width: 294px;">
      </div>
      <div class="con2">
        <p>{{ item.title }}</p>
        <p>{{ item.description }}</p>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "Advertisement",
  data(){
    return{
      userId:null,
      articleId:null,
      clickCount:null,
      article:[],
      articleQuery:{
        sort:0,
        pageSize:1
      }
    }
  },
  methods:{
    advClick(item){

      this.articleId = item.id
      this.clickCount = item.view
      if(window.sessionStorage.getItem('username')){
        this.getRequest('/cms/user/info').then((resp)=>{
          this.userId = resp.data.id
          this.$router.push({path:'/articleDetail', query:{id: this.articleId,userId:this.userId,clickCount:this.clickCount}})
        })

      }else{
        this.$router.push({path:'/articleDetail', query:{id: this.articleId,clickCount:this.clickCount}})
      }

    }
  },
  created() {
    this.getRequest('/p/ams/article/articleList',this.articleQuery).then((resp)=>{
      this.article = resp.data.list
    })
  }
}
</script>

<style scoped>
.adv{
  width: 314px;
  height: 272px;
  color: white;
  background-color: black;
  position: relative;
  /*left: 25.0em;*/
  margin-bottom: 16px;
}
.adv .con1{
  border: solid 10px #b50029;
  height: 178px;
}
.adv .con2{
  /*border-left: #b50029 solid 8px;*/
  margin-left: 12px;
  /*margin-top: 1em;*/
  font-size: 12px;
}
</style>